<template>
  <el-table
          :data="tableData"
          style="width: 100%"
          :row-style='tableRowStyle'
          :header-cell-style="tableHeaderColor">
    <el-table-column
            prop="position"
            label=""
            width="80">
    </el-table-column>
    <el-table-column
            prop="shot"
            label="射门"
            width="80">
    </el-table-column>
    <el-table-column
            prop="goal"
            label="进球"
            width="80">
    </el-table-column>
    <el-table-column
            prop="onTarget"
            label="射正"
            width="80">
    </el-table-column>
    <el-table-column
            prop="post"
            label="中柱"
            width="80">
    </el-table-column>
    <el-table-column
            prop="resistance"
            label="阻挡"
            width="80">
    </el-table-column>
    <el-table-column
            prop="deviation"
            label="射偏"
            width="80">
    </el-table-column>
  </el-table>
</template>

<script>
  export default {
    name: "shotTable",
    data() {
      return {
        tableData: [{
          position: '禁区内',
          shot: 49,
          goal: 9,
          onTarget:16,
          post:3,
          resistance:17,
          deviation:13,
        }, {
          position: '禁区外',
          shot: 68,
          goal: 6,
          onTarget:33,
          post:4,
          resistance:10,
          deviation:21,
        }]
      }
    },
    methods:{
      //设置表格行的样式
      tableRowStyle({row,rowIndex}){
        return {'background-color':'#F1F6F9'}
      },

      //设置表头的样式
      tableHeaderColor({row,column,rowIndex,columnIndex}){
        return {'background-color':'#F1F6F9'}
      },
    }
  }
</script>

<style scoped>

</style>